{include file="common/header" /}

<div class="max-w-7xl mx-auto">
    <div class="bg-white rounded-lg shadow-lg p-6">
        <h3 class="text-2xl font-bold text-gray-800 mb-6">
            <i class="fa fa-edit text-primary mr-2"></i> 报工
        </h3>
        
        {if isset($allocation) && $allocation}
        <div class="grid grid-cols-1 lg:grid-cols-2 gap-8">
            <div>
                <h4 class="text-lg font-semibold text-gray-800 mb-4">任务信息</h4>
                <div class="bg-gray-50 rounded-lg p-4">
                    <div class="space-y-3">
                        <div class="flex justify-between">
                            <span class="font-medium text-gray-700">订单号：</span>
                            <span class="text-gray-900">{$allocation.order.order_no}</span>
                        </div>
                        <div class="flex justify-between">
                            <span class="font-medium text-gray-700">产品名称：</span>
                            <span class="text-gray-900">{$allocation.model.product.name}</span>
                        </div>
                        <div class="flex justify-between">
                            <span class="font-medium text-gray-700">型号名称：</span>
                            <span class="text-gray-900">{$allocation.model.name}</span>
                        </div>
                        <div class="flex justify-between">
                            <span class="font-medium text-gray-700">工序名称：</span>
                            <span class="text-gray-900">{$allocation.process.name}</span>
                        </div>
                        <div class="flex justify-between">
                            <span class="font-medium text-gray-700">分配数量：</span>
                            <span class="text-gray-900">{$allocation.quantity}</span>
                        </div>
                        <div class="flex justify-between">
                            <span class="font-medium text-gray-700">已报数量：</span>
                            <span class="text-gray-900">{$allocation.reported_quantity}</span>
                        </div>
                        <div class="flex justify-between">
                            <span class="font-medium text-gray-700">待报数量：</span>
                            <span class="text-gray-900 font-semibold text-primary">{$allocation.remaining_quantity}</span>
                        </div>
                    </div>
                </div>
            </div>
            
            <div>
                <h4 class="text-lg font-semibold text-gray-800 mb-4">报工</h4>
                <form id="report-form" class="space-y-4">
                    <input type="hidden" name="allocation_id" value="{$allocation.id}">
                    <div>
                        <label class="block text-sm font-medium text-gray-700 mb-2">报工数量：</label>
                        <input type="number" name="quantity" class="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-primary" min="1" max="{$allocation.remaining_quantity}" required>
                        <p class="text-xs text-gray-500 mt-1">最大可报数量：{$allocation.remaining_quantity}</p>
                    </div>
                    <button type="submit" class="w-full bg-primary hover:bg-blue-700 text-white font-bold py-3 px-4 rounded-lg transition-colors duration-300">
                        <i class="fa fa-check mr-2"></i>提交报工
                    </button>
                </form>
            </div>
        </div>
        {else}
        <div class="text-center py-12">
            <i class="fa fa-exclamation-triangle fa-3x text-yellow-500 mb-4"></i>
            <h4 class="text-lg font-semibold text-gray-800 mb-2">请先选择要报工的任务</h4>
            <p class="text-gray-600 mb-6">您需要先选择一个任务才能进行报工</p>
            <a href="{:url('worker/tasks')}" class="inline-flex items-center px-6 py-3 bg-primary text-white rounded-lg hover:bg-blue-700 transition-colors">
                <i class="fa fa-tasks mr-2"></i>查看我的任务
            </a>
        </div>
        {/if}
    </div>
</div>

<script src="https://cdn.jsdelivr.net/npm/jquery@3.6.0/dist/jquery.min.js"></script>
<script>
$(function() {
    $('#report-form').on('submit', function(e) {
        e.preventDefault();
        
        var formData = $(this).serialize();
        
        $.post('{:url("worker/submit")}', formData, function(data) {
            if (data.code === 1) {
                alert('报工成功！');
                window.location.href = '{:url("worker/tasks")}';
            } else {
                alert('报工失败：' + data.msg);
            }
        });
    });
});
</script>

{include file="common/footer" /} 